<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>登录</title>
  <style>
     * {
      margin: 0;
      padding: 0;
    }

    main {
      width: 800px;
      height: 500px;
      margin: 0 auto;
      margin-top: 40px;
    
    }

    .box1 {
      background-image: url(../img/03.jpg);
      width: 400px;
      height: 500px;
      float: left;
      background-size: 100%;
      background-repeat: repeat;
      border-radius: 20px;
    }

    .inp {
      width: 400px;
      height: 500px;
      background-color: rgb(239, 242, 243);
      float: left;
      border-radius: 20px;
    }

    input {
      width: 300px;
      height: 45px;
      border-radius: 20px;
      border: 1px #66a6ea solid;
      margin: 20px 50px;
      font-size: 16px;
      text-indent: 1em;
      color: #333;
      outline: none;
    }

    h3 {
      text-align: center;
      margin-top: 25px;
      color: rgb(103, 103, 226);
      font-size: 30px;
    }

    .button {
      width: 300px;
      height: 45px;
      border-radius: 20px;
      background-color: #66a6ea;
      margin: 10px 50px;
      font-size: 16px;
      border: 1px #66a6ea solid;
      text-align: center;
    }
    .button:hover{
      background-color: rgb(156, 197, 233);
    }
    .QQ{
      margin: 70px 138px;

    }
  </style>
</head>
<body>

<main>

  <div class="box1"></div>
  <div class="inp">
    <h3>欢迎回家~请登录</h3>
    <p></p>
    <input type="text" placeholder="用户名"><br>
    <input type="text" placeholder="密码"><br>
    <input type="button" value="登录" class="button">
    <img src="https://static.epetbar.com/static_web/pc/src/images/newlogin/newico2.png" class="QQ">
  
  </div> 

</main>
<script src="../js/ajax.js"></script>
<script>
const baseUrl = "http://localhost:8888"
let oP = document.querySelector("p")
let aInputs = document.querySelectorAll("input")
aInputs[aInputs.length-1].onclick = function(){
let params = {
username:aInputs[0].value,
password:aInputs[1].value,
}
ajax({
url:baseUrl+"/users/login",
type:"post",
params,
fn(resData){
  console.log(resData);
  // localStorage.setItem("nickname",resData.user.nickname)
  localStorage.setItem("token",resData.token)
  // localStorage.setItem("uid",resData.user.id)
  location.href = "../01homepage.html"
  console.log(token);
}
})
}

</script>
</body>
</html>